﻿@page "/_Host"
@namespace BlazorPlusDemo.Pages
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@{
	Layout = null;

}

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<title>BlazorPlusDemo</title>
	<base href="~/" />
	<link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
	<link href="css/site.css" rel="stylesheet" />

	@{
		string useragent = Request.Headers["User-Agent"].FirstOrDefault();
	}
	@if (useragent != null && (useragent.Contains("MSIE") || useragent.Contains("Trident")))
	{
		//For IE11 , check https://github.com/Daddoon/Blazor.Polyfill/ for more
	<script src="https://github.com/Daddoon/Blazor.Polyfill/releases/download/3.0.8/blazor.polyfill.min.js" type="text/javascript"></script>
	}

	@*Install-BlazorPlus*@
	<script src="/_blazorplus_handler?action=script" type="text/javascript"></script>

	<script>
		//after blazorplus script override the implementation
		function GetWaitingMaskHTML() {
			return "<svg version='1.1' xmlns='http://www.w3.org/2000/svg' x='0px' y='0px' width='80px' height='80px' viewBox='0 0 40 40' enable-background='new 0 0 40 40' xml:space='preserve'><path opacity='0.2' fill='#000' d='M20.201,5.169c-8.254,0-14.946,6.692-14.946,14.946c0,8.255,6.692,14.946,14.946,14.946 s14.946-6.691,14.946-14.946C35.146,11.861,28.455,5.169,20.201,5.169z M20.201,31.749c-6.425,0-11.634-5.208-11.634-11.634 c0-6.425,5.209-11.634,11.634-11.634c6.425,0,11.633,5.209,11.633,11.634C31.834,26.541,26.626,31.749,20.201,31.749z'></path><path fill='#000' d='M26.013,10.047l1.654-2.866c-2.198-1.272-4.743-2.012-7.466-2.012h0v3.312h0 C22.32,8.481,24.301,9.057,26.013,10.047z' transform='rotate(228 20 20)'><animateTransform attributeType='xml' attributeName='transform' type='rotate' from='0 20 20' to='360 20 20' dur='0.5s' repeatCount='indefinite'></animateTransform></path></svg>";
		}
	</script>

	<!-- @Request.Host.Host -->

</head>
<body>
	<div style="opacity:0.0;transition:opacity linear 2s;position:fixed;left:0;top:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:center;">
		<script>document.write(GetWaitingMaskHTML())</script>
		<div style="height:30px">
			Loading..
		</div>
	</div>

	<app>
		@if (System.Environment.GetEnvironmentVariable("DemoServerPrerendered") =="YES")
		{
			<component type="typeof(App)" render-mode="ServerPrerendered" />
		}
		else
		{
			<component type="typeof(App)" render-mode="Server" />
		}
	</app>

	<script>
		new function () {
			var div = document.querySelector("div");
			var app = document.querySelector("app");
			var html = app.innerHTML;
			function CheckLoaded() {
				if (app.innerHTML == html)
					setTimeout(CheckLoaded, 500);
				else if (div.parentNode)
					div.parentNode.removeChild(div);
			}
			CheckLoaded();
			if (window.MutationObserver) {
				var observer = new MutationObserver(function (mutations, observer) {
					if (div.parentNode)
						div.parentNode.removeChild(div);
					observer.disconnect();
				});
				observer.observe(app, { childList: true });
			}
			setTimeout(function () {
				div.style.opacity = "1.0";
			}, 10);
		}
	</script>

	<div id="blazor-error-ui">
		<environment include="Staging,Production">
			An error has occurred. This application may no longer respond until reloaded.
		</environment>
		<environment include="Development">
			An unhandled exception has occurred. See browser dev tools for details.
		</environment>
		<a href="" class="reload">Reload</a>
		<a class="dismiss">🗙</a>
	</div>

	<script src="_framework/blazor.server.js"></script>
</body>
</html>
